/*
 * Licensed to The Apereo Foundation under one or more contributor license
 * agreements. See the NOTICE file distributed with this work for additional
 * information regarding copyright ownership.
 *
 *
 * The Apereo Foundation licenses this file to you under the Educational
 * Community License, Version 2.0 (the "License"); you may not use this file
 * except in compliance with the License. You may obtain a copy of the License
 * at:
 *
 *   http://opensource.org/licenses/ecl2.txt
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
 * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.  See the
 * License for the specific language governing permissions and limitations under
 * the License.
 *
 */

// Roll Up Menu
// ----------------------------------------

#roll-up-menu {
    float: left;
    width: 80px;
    background: #fff;
    border: $thin-border-stroke #c3cbd0;
    border-top: none;
    @include border-bottom-radius(4px);
    position: absolute;
    top: 1px;
    left: -1px;

    // Hide menu
    opacity: 0;

    #nav-container {
        display: none;
        margin-top: -1px;
        padding-top: 1px;
    }

    // Nav icons.
    a {
        $height: 60px;

        width: 80px;
        height: $height;
        line-height: $height;
        margin: 0 auto;
        text-align: center;
        vertical-align: middle;
        display: block;

        > i {
            display: inline-block;
            margin: 0 auto;
            vertical-align: middle;
            position: relative;
            line-height: 50px;
            @include transition(all .2s);
            color: #c6c6c6;
        }

        &:hover > i,
        &:active > i {
            color: #818181;
            @include fa-icon-color(before, "#818181");
        }


        @keyframes fadeIn {
            0% {
                opacity: 0;
            }
            80% {
                opacity: 0;
            }
            100% {
                opacity: 0.9;
            }
        }

        .events {
            @include fa-icon($fa-var-calendar-check-o, before, block, -3px 0 0 0, 0, inherit, 29px, normal, inherit);
        }

        .systems {
            @include fa-icon($fa-var-server, before, block, -3px 0 0 0, 0, inherit, 29px, normal, inherit);
        }

        .recordings {
            @include fa-icon($fa-var-video-camera, before, block, -3px 0 0 0, 0, inherit, 29px, normal, inherit);
        }

        .users {
            @include fa-icon($fa-var-user, before, block, -3px 0 0 0, 0, inherit, 29px, normal, inherit);
        }

        .statistics {
            @include fa-icon($fa-var-signal, before, block, -3px 0 0 0, 0, inherit, 29px, normal, inherit);
        }

        .configuration {
            @include fa-icon($fa-var-cogs, before, block, -3px 0 0 0, 0, inherit, 29px, normal, inherit);
        }
    }
}
